<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title></title>
    <script src="//cdn.66173.cn/www/js/jquery-1.8.3.min.js"></script>
    <script type="text/javascript">
        $(function () {
            AddSth();
        });
        $(function () {
            $(".main").unbind("scroll").bind("scroll", function (e) {
                var sum = this.scrollHeight;
                if (sum <= $(this).scrollTop() + $(this).height()) {
                    AddSth();
                }
            });
        });
        function AddSth() {
            $.ajax({
                type: 'POST',
                url: "index.aspx/ReturnSth",
                dataType: "json",
                contentType: "application/json; charset=utf-8",
                //data: "",
                success: function (data) {
                    json = $.parseJSON(data.d);
                    for (var i in json) {
                        var tbBody = "<ul><li>" + json[i].sth + "</li></ul>";
                        $(".main").append(tbBody);
                    }
                    $(".main").append("<hr />");
                }
            });
        }
    </script>
</head>
<body>
<form id="form1" runat="server">
    <div>下拉加载更多</div><br />
    <div class="main" style="border: 1px solid red; height: 700px; overflow: auto;"></div>
</form>
</body>
<script>
    $(window).on('scroll',function(){
        if(scrollTop() + windowHeight() >= (documentHeight() - 50)){/*滚动响应区域高度取50px*/
            loadMore();
        }
    });
    //获取页面顶部被卷起来的高度
    function scrollTop(){
        return Math.max(
            //chrome
            document.body.scrollTop,
            //firefox/IE
            document.documentElement.scrollTop);
    }
    //获取页面文档的总高度
    function documentHeight(){
        //现代浏览器（IE9+和其他浏览器）和IE8的document.body.scrollHeight和document.documentElement.scrollHeight都可以
        return Math.max(document.body.scrollHeight,document.documentElement.scrollHeight);
    }
    //窗口可视高度
    function windowHeight(){
        return (document.compatMode == "CSS1Compat")?
            document.documentElement.clientHeight:
            document.body.clientHeight;
    }

</script>
</html>